<template>
  <div>
    <slot v-bind="wrappedBindings"></slot>
  </div>
</template>
<script>
export default {
  props: {
    value: { required: true }
  },
  methods: {
    onInput($event) {
      this.$emit('input', $event)
    }
  },
  computed: {
    wrappedBindings() {
      // return {
      //   attrs: {
      //     value: this.value
      //   },
      //   on: {
      //     input: $event => this.onInput($event),
      //     'update:value': $event => this.onInput($event)
      //   }
      // }
      const self = this;
      const bindings = {
        attrs: {},
        on: {},
        model: {}
      };
      Object.defineProperty(bindings.model, "proxy", {
        get() {
          return self.value
        },
        set(newValue) {
          self.$emit("input", newValue);
        },
        enumerable: true,
        configurable: false
      });
      return bindings
    }
  }
}
</script>